<!-- 烟气巡检 -->
<template>
  <div class="custome-table">
    <el-form>
      <div class="table-title">烟气自动监测设备日常巡检记录表</div>
      <!-- row1 -->
      <div class="table-row-item">
        <div class="table-row-item">
          <div class="item-label">维护管理单位</div>
          <div class="item-value">{{ form.key1 }}</div>
        </div>
        <div class="table-row-item">
          <div class="item-label">企业名称</div>
          <div class="item-value">{{ form.enterpriseName }}</div>
        </div>
      </div>
      <!-- row2 -->
      <div class="table-row-item">
        <div class="table-row-item">
          <div class="item-label">排放口名称</div>
          <div class="item-value">{{ form.outletName }}</div>
        </div>
        <div class="table-row-item">
          <div class="item-label">运维结果</div>
          <div class="item-value">
            <el-select v-model="form.key4" :disabled="detail" placeholder="请选择">
              <el-option
                v-for="item in typeList"
                :key="item.id"
                :label="item.codeName"
                :value="item.code"
              />
            </el-select>
          </div>
        </div>
      </div>
      <!-- row3 -->
      <div class="table-row-item">
        <div class="table-row-item">
          <div class="item-label">填报时间</div>
          <div class="item-value">
            <el-date-picker
              v-model="form.key5"
              :disabled="detail"
              type="datetime"
              placeholder="选择填报时间"
            />
          </div>
        </div>
        <div class="table-row-item">
          <div class="item-label">填报人</div>
          <div class="item-value">{{ form.key6 }}</div>
        </div>
      </div>
      <!-- row4 -->
      <div class="table-row-item">
        <div class="table-row-item">
          <div class="item-label">签到时间</div>
          <div class="item-value">
            <el-date-picker
              v-model="form.key7"
              :disabled="detail"
              type="datetime"
              placeholder="选择签到时间"
            />
          </div>
        </div>
        <div table-row-item />
      </div>

      <div class="custom-table">
        <table>
          <tr>
            <td colspan="4" class="text-center">维护巡检项目</td>
            <td class="text-center">检查情况</td>
            <td colspan="3" class="text-center">备注</td>
          </tr>
          <tr>
            <td colspan="4" class="text-center">分析仪表间空调、照明、室温是否正常</td>
            <td class="text-center"> <el-select v-model="form.key8" :disabled="detail" placeholder="">
              <el-option
                v-for="(yn,idx) in yesNoList"
                :key="'select_'+idx"
                :label="yn.label"
                :value="yn.value"
              />
            </el-select></td>
            <td colspan="3"><el-input v-model="form.key9" :disabled="detail" /></td>
          </tr>
          <tr>
            <td colspan="4" class="text-center">烟气仪表柜面板上是否有故障报警、维护请求</td>
            <td class="text-center"> <el-select v-model="form.key10" :disabled="detail" placeholder="">
              <el-option
                v-for="(yn,idx) in yesNoList"
                :key="'select_'+idx"
                :label="yn.label"
                :value="yn.value"
              />
            </el-select></td>
            <td colspan="3"><el-input v-model="form.key11" :disabled="detail" /></td>
          </tr>
          <tr>
            <td colspan="4" class="text-center">系统吹扫、取样PLC是否运行正常</td>
            <td colspan="1" class="text-center"> <el-select v-model="form.key12" :disabled="detail" placeholder="">
              <el-option
                v-for="(yn,idx) in yesNoList"
                :key="'select_'+idx"
                :label="yn.label"
                :value="yn.value"
              />
            </el-select></td>
            <td colspan="3"><el-input v-model="form.key13" :disabled="detail" /></td>
          </tr>
          <tr>
            <td colspan="4" class="text-center">取样管路是否有堵塞及泄露</td>
            <td colspan="1" class="text-center"> <el-select v-model="form.key14" :disabled="detail" placeholder="">
              <el-option
                v-for="(yn,idx) in yesNoList"
                :key="'select_'+idx"
                :label="yn.label"
                :value="yn.value"
              />
            </el-select></td>
            <td colspan="3"><el-input v-model="form.key15" :disabled="detail" /></td>
          </tr>
          <tr>
            <td colspan="4" class="text-center">浮子流量计流量是否在0.5~1.5L/min左右</td>
            <td colspan="1" class="text-center"> <el-select v-model="form.key16" :disabled="detail" placeholder="">
              <el-option
                v-for="(yn,idx) in yesNoList"
                :key="'select_'+idx"
                :label="yn.label"
                :value="yn.value"
              />
            </el-select></td>
            <td colspan="3"><el-input v-model="form.key17" :disabled="detail" /></td>
          </tr>
          <tr>
            <td colspan="4" class="text-center">伴热控制系统及温度是否正常</td>
            <td colspan="1" class="text-center"> <el-select v-model="form.key18" :disabled="detail" placeholder="">
              <el-option
                v-for="(yn,idx) in yesNoList"
                :key="'select_'+idx"
                :label="yn.label"
                :value="yn.value"
              />
            </el-select></td>
            <td colspan="3"><el-input v-model="form.key19" :disabled="detail" /></td>
          </tr>
          <tr>
            <td colspan="4" class="text-center">冷凝器温度是否在0~5℃</td>
            <td colspan="1" class="text-center"> <el-select v-model="form.key20" :disabled="detail" placeholder="">
              <el-option
                v-for="(yn,idx) in yesNoList"
                :key="'select_'+idx"
                :label="yn.label"
                :value="yn.value"
              />
            </el-select></td>
            <td colspan="3"><el-input v-model="form.key21" :disabled="detail" /></td>
          </tr>
          <tr>
            <td colspan="4" class="text-center">风机运行是否正常</td>
            <td colspan="1" class="text-center"> <el-select v-model="form.key22" :disabled="detail" placeholder="">
              <el-option
                v-for="(yn,idx) in yesNoList"
                :key="'select_'+idx"
                :label="yn.label"
                :value="yn.value"
              />
            </el-select></td>
            <td colspan="3"><el-input v-model="form.key23" :disabled="detail" /></td>
          </tr>
          <tr>
            <td colspan="4" class="text-center">记事</td>
            <td colspan="7">
              <el-input v-model="form.key24" :disabled="detail" type="textarea" />
            </td>
          </tr>
        </table>
        <table style="margin-top: 20px;">
          <tr>
            <td width="150">
              上传文件：图片
            </td>
            <td colspan="6">
              <TableUpLoadFile ref="tableUploadFile" :files-list="filePath" :detail="detail" />
            </td>
          </tr>
          <tr>
            <td width="150">
              上传文件：视频
            </td>
            <td colspan="6">
              <TableUpLoadVideo ref="tableUploadVideo" :video-list="videoPath" :detail="detail" />
            </td>
          </tr>
        </table>
      </div>
    </el-form>

  </div>
</template>

<script>
import { getDict } from '@/utils/dict'
import { fileUrl, staticImgUrl } from '@/url'
import TableUpLoadFile from './../TableUpLoadFile'
import TableUpLoadVideo from './../TableUpLoadVideo'
export default {
  name: 'Yqxj',
  components: {
    TableUpLoadFile,
    TableUpLoadVideo
  },
  props: {
    obj: {
      type: Object,
      default: null
    },
    maintenaIndex: {
      type: Number,
      default: 0
    },
    detail: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      imagePreview: false,
      videoLoadingFlag: false,
      imgLoadingFlag: false,
      typeList: [],
      fileUrl, staticImgUrl,
      yesNoList: [
        { value: '是', label: '是' },
        { value: '否', label: '否' }
      ],
      // 显示的图片数据
      filePath: [],
      showVideoPath: [],
      videoPath: [],
      form: {
        key1: '', enterpriseName: '', outletName: '',
        key4: null, key5: '', key6: '',
        key7: '', key8: '是', key9: '',
        key10: '是', key11: '', key12: '是', key13: '', key14: '是', key15: '', key16: '是', key17: '',
        key18: '是', key19: '', key20: '是', key21: '', key22: '是', key23: '', key24: ''
      }
    }
  },
  created() {
    this.init()
    this.typeList = getDict('e015')
    const infoStr = this.$store.getters.user.info
    if (infoStr) {
      const info = JSON.parse(infoStr)
      this.form.key6 = info.realName
    }
  },
  methods: {
    init() {
      if (this.obj.list) {
        const maintenaData = this.obj.list[this.maintenaIndex]
        if (maintenaData.filePath) {
          this.filePath = JSON.parse(maintenaData.filePath)
          this.$refs['tableUploadFile'].init(this.filePath)
        }
        if (maintenaData.videoPath) {
          this.videoPath = JSON.parse(maintenaData.videoPath)
        }
        if (maintenaData.formContent) {
          this.form = JSON.parse(maintenaData.formContent)
        }
        this.form.enterpriseName = this.obj.enterpriseName
        this.form.outletName = this.obj.outletName
      }
    },
    getFormData() {
      return {
        formContent: JSON.stringify(this.form),
        filePath: this.$refs.tableUploadFile ? this.$refs.tableUploadFile.getPaths() : [],
        videoPath: this.$refs.tableUploadVideo ? this.$refs.tableUploadVideo.getPaths() : [],
        maintenaIndex: this.maintenaIndex
      }
    },
    clearData() {
      this.form = {
        key1: '', enterpriseName: '', outletName: '',
        key4: null, key5: '', key6: '',
        key7: '', key8: '是', key9: '',
        key10: '是', key11: '', key12: '是', key13: '', key14: '是', key15: '', key16: '是', key17: '',
        key18: '是', key19: '', key20: '是', key21: '', key22: '是', key23: '', key24: ''
      }
    }
  }
}
</script>

<style lang="scss" scoped>

</style>
